var $pnlMenusUsuario;
var $menuRaizCorrente;
var $migalhaMenu;
var $pnlMenuAberto;
var $ulComApp;
var $liApp;
var $liSbm;
var $txtBuscaApp;
var $pnlAvisoBusca;
var textoBuscado = '';

$(document).ready(function (e) {

    // Adicionar quebra entre os itens de submenu e itens de aplicação no menu.
    $("#pnlMenusUsuario ul").each(function () {
        $("<br />").insertAfter($(this).find('.sbm:last'));
    })

    $pnlMenusUsuario = $('#pnlMenusUsuario');
    $pnlMenuAberto = $('div#pnlMenuAberto');
    $ulComApp = $('div#pnlMenusUsuario *:has(li.app)');
    $liApp = $('div#pnlMenusUsuario > * > li.app');
    $liSbm = $('div#pnlMenusUsuario > * > li.sbm');
    $txtBuscaApp = $('#txtBuscaApp');
    $pnlAvisoBusca = $('#pnlAvisoBusca');
    $linhasSeparadoras = $('#pnlMenusUsuario ul br');
    $migalhaMenu = $('ul.migalhaMenu');

    var $liAppArray = $(); // object instead of array
    $.each($liApp, function (i, item) {
        $liAppArray = $liAppArray.add(item);
    });

    /*
    * AÇÃO: Clique no menu Raiz
    * Cuida do comportamento do clique no menu raiz
    */
    $("div#pnlMenuRaiz ul li").click(function () {

        $liSbm.show();
        $liApp.show();

        if (typeof $(this).attr('rel') !== 'undefined' && $(this).attr('rel') !== false) {

            if ($pnlMenuAberto.css('max-height') == "0px") {
                //Seta current no ul dos menus do usuário com o id do rel clicado
                exibeMenuCurrentUsuario($(this).attr("rel"));

                //Seta current no li do menu raiz clicada
                setaCurrentMenuRaiz($(this));

                //Abre o painel de menu
                abrePanelMenu();

            } else {
                if ($(this).hasClass("current")) {
                    setaCurrentMenuRaiz($(this), true);
                    fechaPanelMenu();
                } else {
                    //as três linhas abaixo fazem com que a troca de painel seja animada
                    var that = this;
                    $pnlMenuAberto.css('max-height', 0);
                    $pnlMenuAberto.css('padding', '0 30px');
                    setTimeout(function () {
                        //Seta current no ul dos menus do usuário com o id do rel clicado
                        exibeMenuCurrentUsuario($(that).attr("rel"));

                        //Seta current no li do menu raiz clicada
                        setaCurrentMenuRaiz($(that));

                        $pnlMenuAberto.css('max-height', 300);
                        $pnlMenuAberto.css('padding', '10px 30px');
                    }, 310);
                }
            }

        }

    })

    /*
    * AÇÃO: Clique na migalha da aplicação
    * Cuida do comportamento do clique no menu raiz
    */
    $("ul#lstMigalhaAplicacao li").click(function (event) {

        $liSbm.show();

        //Seta current no ul dos menus do usuário com o id do rel clicado
        exibeMenuCurrentUsuario($(this).attr("rel"));

        //Seta current no li do menu raiz clicada
        //alert(vetorMigalhaApp[0])
        setaCurrentMenuRaiz(($("#menuRaiz li#" + $(this).parent().attr("parent"))));

        //Abre o painel do menu
        abrePanelMenu();

        event.stopPropagation();
    })

    /*
    * AÇÃO: Clique no submenu do painel migalha do menu
    * Cuida do comportamento no submenu a ser exibido no painel de menu
    */
    $("div#pnlMenusUsuario > * > li.sbm").click(function () {
        //as três linhas abaixo fazem com que a troca de painel seja animada
        var that = this;
        $pnlMenusUsuario.css('opacity', 0);
        setTimeout(function () {

            // Exibe o menu do rel do elemento clicado
            exibeMenuCurrentUsuario($(that).attr("rel"));

            $pnlMenusUsuario.css('opacity', 100);
        }, 100);
    })

    /*
    * AÇÃO: Clique na migalha do menu
    * Cuida do comportamento do clique na migalha do menu
    */
    $("ul.migalhaMenu").on('click', 'li', function () {
        //as três linhas abaixo fazem com que a troca de painel seja animada
        var that = this;
        $pnlMenusUsuario.css('opacity', 0);
        setTimeout(function () {
            // Exibe o menu do rel do elemento clicado
            exibeMenuCurrentUsuario($(that).attr("rel"));

            $pnlMenusUsuario.show();
            $pnlAvisoBusca.hide();
            $linhasSeparadoras.show();

            $pnlMenusUsuario.css('opacity', 100);
        }, 100);
    })

    /*
    * Ação: clique fora do menu aberto para fechar o menu
    * 
    */

    $('html').click(function (e) {
        fechaPanelMenu();
    });

    $('#pnlMenuAberto, #pnlMenuRaiz').click(function (event) {
        event.stopPropagation();
    });

    /*
    * FUNCAO: montaVetorMigalhaMenu 
    * Adiciona elemento no vetor já existente
    */
    function adicionaNoMenuVetor(elemento) {
        var vetorMenu = $("ul#migalhaMenu").children();
        vetorMenu.push(elemento);

        return vetorMenu;
    }

    /*
    * FUNCAO: exibeMenuCurrentUsuario
    * Exibe a <UL> com o id do atributo rel do elemento cliciado clicado.
    */
    function exibeMenuCurrentUsuario(idRel) {

        //Esconder o #ul exibido atualmente.
        $("#pnlMenusUsuario > *").hide();

        $pnlMenusUsuario.show();
        $pnlAvisoBusca.hide();
        $linhasSeparadoras.show();

        //Mostrar o ul do item que o usuário clicou.
        $("#pnlMenusUsuario > *#" + idRel).show().children().show();

    }

    /*
    * FUNCAO: setaCurrentMenuRaiz
    * Marca i <LI> clicado na raiz
    */
    function setaCurrentMenuRaiz($elemento) {

        //limpa o current do elemento atual
        if ($menuRaizCorrente)
            $menuRaizCorrente.removeClass("current");

        // seta o current no elemento clicado
        $menuRaizCorrente = $elemento.addClass("current");
    }

    /*
    * FUNCAO: abrePanelMenu
    * Exibe a div com o painel do menu
    */
    function abrePanelMenu() {

        // Esconde a migalha da aplicação
        $("ul#lstMigalhaAplicacao li").hide();

        // Abre o painel do menu
        $pnlMenuAberto.css('max-height', 300);
        $pnlMenuAberto.css('padding', '10px 30px');

    }

    /*
    * FUNCAO: fechaPanelMenu
    * Exibe a div com o painel do menu
    */
    function fechaPanelMenu() {

        // Tira o current do item do menu com o current atual
        if ($menuRaizCorrente)
            $menuRaizCorrente.removeClass("current");

        // Fecha o painel do menu
        $pnlMenuAberto.css('max-height', 0);
        $pnlMenuAberto.css('padding', '0 30px');

        $txtBuscaApp.val('').change();

        // Exibe a migalha da aplicação
        $("ul#lstMigalhaAplicacao li").show();
    }

    if ($txtBuscaApp && $txtBuscaApp.length) {

        $txtBuscaApp.on('focus',
            function (e) {
                if ($menuRaizCorrente)
                    $menuRaizCorrente.removeClass('current');

                $pnlMenuAberto.css('max-height', 0);
                $pnlMenuAberto.css('padding', '0 30px');


                setTimeout(function () {
                    abrePanelMenu();
                    $linhasSeparadoras.hide();
                    $pnlMenusUsuario.hide();
                    $liSbm.hide();
                    $liApp.hide();
                    $ulComApp.show();
                    $pnlAvisoBusca.show();

                    $pnlMenuAberto.css('max-height', 300);
                    $pnlMenuAberto.css('padding', '10px 30px');

                }, 310);
            }).on('keypress',
                function (e) {
                    if (e.keyCode === 10 || e.keyCode === 13) {
                        e.preventDefault();
                    }
                }).fastLiveFilter($liAppArray, {
                    callback: function (total, filterText) {
                        if (textoBuscado !== filterText) {
                            if (!filterText || filterText.length < 3) {
                                $pnlAvisoBusca.show().text('Digite pelo menos 3 caracteres para iniciar sua busca');
                                $pnlMenusUsuario.hide();
                            } else if (total == 0) {
                                $pnlAvisoBusca.show().text('Nenhum resultado encontrado');
                                $pnlMenusUsuario.hide();
                            } else {
                                $pnlAvisoBusca.hide();
                                $pnlMenusUsuario.show();
                            }
                            $migalhaMenu.hide();

                            $migalhaMenu.each(function () {
                                var $irmaosLi = $(this).siblings('li:visible');

                                if ($irmaosLi.length) {
                                    $(this).show();
                                }
                                else {
                                    $(this).hide();
                                }
                            });

                            $linhasSeparadoras.hide();

                            textoBuscado = filterText;
                        }
                    }
                });
    }
});

function capitalizeFirstLetter(string) {
    return string.charAt(0).toUpperCase() + string.slice(1);
}